<?php
include_once("../../php/include_all.php");
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link href="../../css/bootstrap.min.css" rel="stylesheet">
</head>

<body>
<div class="row-fluid sortable">
	<div class="box span12 geo-box">
    	<div class="box-header well">
			<h2><i class="icon-edit"></i> Misi</h2>
		</div>
        <div class="box-content">
        	<div class="accordion" id="accordion2">
            	<div class="accordion-group">
                	<div class="accordion-heading"><a class="btn btn-primary" data-toggle="collapse" data-parent="#accordion2" href="#collapseTwo">Tambah Data</a></div>
                    <div id="collapseTwo" class="accordion-body collapse">
                    	<div class="accordion-inner">
                        	<form id="form_misi" class="form-horizontal"  method="post" action="">
                            	<input type="hidden" name="act" value="simpan_misi">
                                <table class="table-form">
                                	<input type="hidden" id="id_misi" name="id_misi" value="0">
                                    <tr>
                                    	<td>Visi</td>
                                        <td>
                                        	<select name="id_visi" id="id_visi">
                                            	<option value="0">- Pilih Visi -</option>
                                                <?php
													$visi = get_datas ("select * from rpjm_visi order by id_visi");
													foreach ($visi as $visi){
														?>
                                                        <option value="<?php echo $visi['id_visi']; ?>"><?php echo $visi ['visi'];?></option>
                                                        <?php
													}
												?>
                                            </select>
                                        </td> 
                                    </tr>
                                    <tr>
                                    	<td>Misi</td>
                                        <td><textarea name="misi" class="input-xxlarge" rows="3"></textarea></td>
                                    </tr>
                               </table>
                               <table align="right">
                                    <tr>
                                    	<td></td><td></td><td colspan="5"><a class="btn btn-primary bt-simpan-misi"><div id="loader" style="margin-top:2px"></div>&nbsp;Simpan</a><span id="result"></span></td>
                                    </tr>
                                </table>
                            </form>
                        </div>
                    </div>
                    <hr/>
                    <table class="table table-bordered geo-table" align="center" width="100%">
                    	<thead>
                        	<tr>
                        		<th width="5%" style="text-align:center">NO</th>
                        		<th width="40%" style="text-align:center">VISI</th>
                        		<th width="45%" style="text-align:center">MISI</th>
                        		<th width="10%" style="text-align:center">&nbsp;</th>
                            </tr>
                        </thead>
                        <tbody id="tbody-misi">
                        <?
                        	$t_misi = get_datas ("select m.id_misi, v.id_visi, v.visi, m.misi from rpjm_visi v, rpjm_misi m where m.id_visi=v.id_visi order by m.id_misi");
							$no=1;
							foreach ($t_misi as $misi){
							?>
                            	<tr>
                                	<td style="text-align:center"><? echo $no;?></td>
                                    <td><? echo $misi ['visi'];?></td>
                                    <td><? echo $misi['misi']?></td>
                                    <td style="text-align:center"><a href="#collapseTwo" data-toggle="collapse" data-parent="#accordion2" class="btn btn-info btn-small bt-edit-misi" name="<?php echo $misi['id_misi']; ?>"><i class="icon-edit icon-white"></i>Ubah</a></td>
                                </tr>
                            <?
							$no++;
							}
						?>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript">
	var urls = 'aksi_misi.php';
	
	$('.bt-simpan-misi').click(function(){
	var btn  = $(this);
	var load = $('#loader');
	var rslt = $('#result');
	load.addClass('spinner pull-left');
	btn.removeClass('btn-primary').addClass('btn-info');
	
	var form = $('#form_misi');
	var data = form.serializeArray();
	var post = $.post(urls,data);
	post.done(function(res){
		var result = res.split('__');
		//   0      1     2 
		//success__idkeg__(isi tbody)tr
		if(result.length==3){
			if(result[0]=='success'){
				rslt.html('<font color="green">tersimpan...</font>');
				setTimeout(function(){
					rslt.html('');
				},1500);
				
				var tbody = $('#tbody-misi');
				tbody.html(result[2]);
				init();
			}else{
				rslt.html('<font color="red">'+res+'</font>');
			}
		}else{
			rslt.html('<font color="red">'+res+'</font>');
		}
		load.removeClass();
		btn.removeClass('btn-info').addClass('btn-primary');
		var col =	$('#collapseTwo');
		col.removeClass('in');
		col.css('height','0');
	});
});

function init(){
	$('.bt-edit-misi').click(function(){
		var idmisi= this.name;
		var form = $('#form_misi');
		var post = $.post(urls,{act:'edit_misi',idmisi:idmisi});
		post.done(function(res){
			var value = res.split('__');
			
			//  0        1       2      
			//id_visi__visi__periode
			$('#id_misi').val(value[0]);
			form.find('select[name="id_visi"]').val(value[1]);
			form.find('textarea[name="misi"]').html(value[3]);
			//console.log(res);
		});
	});
}
init();
</script>
</body>
</html>
